//列表页less
@import 'common.less';
#content{
    width:@allwidth;
     .mauto;
    //面包屑导航
    .breadBist{
        overflow: hidden;
        margin-top:20px;
        margin-bottom:10px;
        .left{
            .f(left);
        }
        .right{
            .f(right);
        }
        span{
             color:#b4b4b4;
             .pcount{
                 color:@redcolor;
              }
         }    
    }
    //尺码选择表格
    .selectSize{
        @ccolor:#C7CACD;
        .typearea{
            .of;
            border:1px solid @ccolor;
            //分类开始
            .category{
               .of;
               line-height:24px;
               //分类标题
                .categoryLeft{
                    padding:5px 0px;
                    width:66px;
                    text-align: center;
                    .f(left);
                    border-right:1px solid @ccolor;
                    border-bottom:1px dashed @ccolor;          
                }
                .categoryRight{
                    padding:5px 0px;
                    width:1131px;
                    .of;
                    .f(left);
                    text-align: center;
                    border-bottom:1px dashed @ccolor;
                    ul{
                        margin-left:20px;
                        li{
                         .f(left);
                              margin-right:2px;
                              a{
                                  .dsb;
                                 padding:0 8px 0 8px;
                                 &.select{
                                     background:#B81B22;
                                        color:white;
                                     }
                              }
                            
                         }
                        span{
                            color:@fontcolor9;
                        }           
                    }
                    
                }
            }
        }
    }
    //尺寸选择结束
    //列表头部
    .productTitle{
        margin-top:15px;
        .of;
        
        //列表标题
        .wrapTitle{
            border-bottom: 3px solid @redcolor;
             height:32px;
             .title{
            line-height: 32px;
            width:88px;
            background:@redcolor;
            
            text-align: center;
            .f(left);
            a{
                display: block;
                color:white;    
            }
        }
        .titlePage{
            padding:10px 5px;
            .f(right);
            .pageNum{
                .f(left);
                margin-right:20px;
            }
            .pageBtn{
                .f(right);
                a{
                     .dsb;
                }
                .prev{
                    width:19px;
                    height:17px;
                    .tcc(17px);
                    .f(left);
                    
                    background:url('../Img/sprites_20130606.png') no-repeat 0 -72px;
                }
                .next{
                    width:48px;
                    height:17px;
                    margin:0 10px;
                    .f(left);
                    background:url('../Img/sprites_20130606.png') no-repeat 0 -89px;
                    
                }
            }
       
        }
    //列表标题结束
        }
         //筛选按钮
        .selectArea{
             height:34px;
             border-left:1px solid @bordercolor;
             border-bottom:1px solid @bordercolor;
             .posr;
             .selectBtn{
                 .f(left);
                li{
                  .f(left);
                  height:34px;
                  line-height:34px;
                  padding:0 12px 0 20px;
                  border-right:1px solid @bordercolor;
                  a{
                      span{
                          .dsb;
                          .zfx(11px);
                          .f(right);
                          margin-top:12px;
                          margin-left:5px;
                           &.upArrow{
                               background: url('../Img/sprites_20130606.png') no-repeat 0 -3091px;  
                             } 
                            &.downArrow{
                               background: url('../Img/sprites_20130606.png') no-repeat -21px -3112px;  
                             }                     
                      }   
                      
                  }
                }    
             }
            //价格输入
                .priceInput{
                    border-right:1px solid @bordercolor;
                    background: white;
                    padding:6px 20px;
                    .f(left);
                    .price{
                        width:35px;
                        border:1px solid #999;
                    }
                  
                } 
                .meger{
                       .posb(0,0);
                       border-left:1px solid @bordercolor;
                       background:#EEEEEE;
                       
                       a{
                        .dsb;
                       .tcc(34px);
                        width:88px;    
                       }
                       
                   }
             
        }
        //筛选按钮结束
        
    }
    
    //列表头部结束
    //商品列表页
    .proList{
        
        margin-top:20px;
        
        //商品详细
        .product{
            .posr;
            //显示右边详细信息
            .goodsdesc{
                .goodsimg{
                    width:280px;
                    height:280px;
                    background:white;
                    img{
                        margin:0 auto;
                    }
                }
                .goodstitle{
                      padding:10px 0;
                      font-size:16px;
                      color:#333;
                      margin-top:20px;
                      margin-left:20px;
                  }
                .sn{
                    font-size:13px;
                    color:#999;
                    margin-left:20px;
                }
                .money{
                    width:272px;
                    height:50px;
                    .money1{
                        .flf;
                        width:48%;
                        height:20px;
                        margin-top:40px;
                        font-size: 14px;
                        color:@redcolor;
                        font-weight: 700;
                        line-height: 20px;
                        border-right:1px dotted #999;
                        text-align:center;
                        font-size: 20px;
                    }
                    .goodscomm{
                        .flf;
                        width:48%;
                        text-align: center;
                        color:@redcolor;
                        font-size:18px;
                        margin-top:35px;
                        strong{
                            font-size: 23px;
                            font-weight: 700;
                        }
                    }
                }
                padding:10px;
                .leftArrow{
                    .dsb;
                    &.aleft{
                        .posa(100px,-24px);
                        border-left:12px solid transparent;
                        border-top:12px solid transparent;
                        border-bottom:12px solid transparent;
                        border-right:12px solid #E6EAF3; 
                    }
                    &.aright{
                        .posa(100px,300px);
                         border-left:12px solid #E6EAF3;
                        border-top:12px solid transparent;
                        border-bottom:12px solid transparent;
                        border-right:12px solid transparent; 
                    }
                    
                    
                }
                display: none;
                width:280px;
                height:473px;
                border:1px solid #777777;
                &.left{
                    .posa(-50px,240px);
                    z-index:1000;
                    background:#E6EAF3;
                }
                &.right{
                    .posa(-50px,-310px);
                    z-index:1000;
                    background:#E6EAF3;
                }
            }
            
            
            &.nomagin{
                    margin-right:0px;
                }
            .f(left);
            width:232px;
            margin:0 4px;
            height:295px;
            .posr;
            padding-bottom:70px;
            .proImg{
               .zfx(230px);
                border:1px solid @bordercolor;
            }
            .imgLink{
                .zfx(228px);
                span{
                   display: block;
                   width:33px;
                   height:23px;
                   .posa(0px,0px);
                   //显示最新标签
                   &.newTag{
                    background: url(../Img/sprites_20130606.png) no-repeat 0 -631px; 
                    }
                }
            }
            //图片列表
            .imgList{
                margin-top:10px;
                margin-bottom:20px;
                .of;
                li{
                    .zfx(22px);
                    .f(left);
                    border:1px solid @bordercolor;
                    margin-right:8px;
                  &.active{
                      border:2px solid @bordercolor;
                  }
                }
                
            }
            //商品名称
            .proTitle{
                 text-align: center;
                a{
                    .ff;
                    font-weight: 300;
                   
                    font-size: 14px;
                    color:#727171;    
                }
            }
            //商品价格
            .proPrice{
                 font-weight: 700;
                 text-align: center;
                 margin-top:10px;
                span{
                    font-size:13px;
                    color:@redcolor;
                    .ff;
                    
                }
            }
        }
    }
    .pager{
        height:15px;
        line-height: 15px;
        //页码
        ul{
            .f(left);
            li{
                padding:0px 5px;
                margin-left:10px;
                 border:1px solid @bordercolor;
                .f(left);
                a{
                   height:15px;
                   .dsb;
                   line-height: 15px;
                    padding:4px;
                    
                }
            }
        }
        
        .f(right);
        margin-bottom:30px;
        //上一页
        .pagePrev{
            display: block;
            .f(left);
            padding:4px 5px 4px 20px;
            border:1px solid @bordercolor;
            .posr;
            .leftArrow{
                .dsb;
                width:9px;
                height:13px;
                .posa(6px,5px);
                background: url(../Img/sprites_20130606.png) no-repeat 0 -2002px;
            }
        }
        //下一页
        .pageNext{
            margin-left:10px;
            .f(left);
            .posr;
            padding:4px 20px 4px 5px;
            border:1px solid @bordercolor;
            .rightArrow{
                .dsb;
                width:9px;
                height:13px;
                .posb(6px,5px);
                background: url(../Img/sprites_20130606.png) no-repeat 0 -1959px;
            }
        }
        .coutPage{
            .f(left);
            height:15px;
             padding:5px;
        }
        .gotoPage{
            .f(left);
            margin-left:10px;
            line-height: 20px;
            .pageNum{
                border:1px solid @bordercolor;
                width:30px;
                height:20px;
            }
        }
        .gotoBtn{
            .f(left);
            margin-left:10px;
            .goto{
                width:49px;
                height:26px;
                border:none;
                background: url(../Img/sprites_20130606.png) 0 -2044px;
            }
        }
    }
    
}
